<template>
    <div class="sys-page">
        <app-title :title="dialogTitle"></app-title>
        <app-notes>通过用户账号进行查询</app-notes>
        <el-row>
            <el-col :span="20">
                <app-search>
                    <el-form :inline="true" :model="searchForm" :rules="addRules" ref="searchForm">
                        <el-form-item prop="sfzmhm">
                            <el-input v-model="searchForm.sfzmhm" placeholder="请输入用户名"></el-input>
                        </el-form-item>
                        <el-form-item>
                            <el-button id="zcc" type="primary" @click="search" :disabled="disButton">查询</el-button>
                        </el-form-item>
                    </el-form>
                </app-search>
            </el-col>
        </el-row>    
            <el-table v-loading="loading" border :data="tableData" :row-class-name="tableRowClassName">
                <el-table-column label="是否实名" width="180" prop="xm"></el-table-column>
                <el-table-column label="实名信息" width="auto" prop="xm"></el-table-column>
            </el-table>
            <el-alert :title="errorMsg" type="warning" :closable="false" show-icon v-show="!reliable"> </el-alert>
    </div>
</template>
<style>
  .el-table .warning-row {
    background: #F08080;
  }

  .el-table .success-row {
    background:#f0f9eb;
  }
</style>

<script>
export default {
    data(){
        var validateUser = (rule, value, callback) => {
            var pattern = /^[a-zA-Z0-9]{1,}$/
            if (value === '') {
                this.disButton = true
                callback(new Error('搜索不能为空'))
            }  else if (! pattern.test(value)) {
                this.disButton = true
                callback(new Error('搜索不为允许中文或特殊符号'))
            } else {
                this.disButton = false
            }
        }
        return {
            picurl: window.axios_g.BASEURL,
            dialogTitle:"实名注册用户查询",
            loading: false,
            picpath: '',
            tableDataTemp: [],
            tableData:[],
            errorMsg:"您的信息有误，请联系管理员修改",
            reliable:true,
            disButton:true,
            searchForm: {               
                sfzmhm: '' 
            },

             addRules: {
                sfzmhm: [
                    {required: true, validator: validateUser, trigger: 'change' }
                ],
            }

       }
    },
    mounted(){
    },
    methods:{
        tableRowClassName({row, rowIndex}) {
          if(this.reliable === false){
            return 'warning-row';
          }else{
              return 'success-row'
          }
        },
        search(){   
            // this.$axios({
            //     url: '/get_realname',
            //     method: 'get',
            // }).then(res => {
            //    conslo.log(res)
            // }).catch(err => {
            //     console.warn(`获取数据失败。${err}`)
            // })           
        }
    }
}
</script>

    
